<style>
    #path_item .fa-close {
        color: #FF5722;
        padding: 6px;
        cursor: pointer;
    }
</style>
<div class="layuimini-container">
    <form id="app-form" class="layui-form layuimini-form">
        <input type="hidden" name="update_time" value="{$row.update_time|default=''}">
        <div class="layui-tab layui-tab-brief" lay-filter="card">
            <ul class="layui-tab-title">
                <li class="layui-this">{:lang('collect.title_base')}</li>
                {if !empty($row['id']) && auth('tally.Ratio/index') }
                <li lay-id="ratio">{:lang('ratio.title_person_info')}</li>
                {/if}
                <div class="operate-bar">
                    {if !empty($row['id']) && auth('tally.Ratio/add') }
                    <button type="button" id="addRatio" class="layui-btn layui-btn-normal layui-btn-sm hide">
                        {:lang('ratio.btn_add')}
                    </button>
                    {/if}
                    <button type="submit" class="layui-btn layui-btn-normal layui-btn-sm" lay-submit>
                        {:lang('common.btn_save')}
                    </button>
                </div>
            </ul>
            <div class="layui-tab-content">
                <div class="layui-tab-item layui-show">
                    <div class="layui-form-item">
                        <label class="layui-form-label">{:lang('collect.collect_month')}</label>
                        <div class="layui-input-inline">
                            <input name="collect_month" class="layui-input cssMonth"
                                   placeholder="{:lang('common.choose')}{:lang('collect.collect_month')}"
                                   value="{$row._month|default=''}">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">{:lang('custom.name')}</label>
                        <div class="layui-input-block">
                            <select name="custom_id" lay-search lay-verify="required">
                                <option value="">{:lang("common.choose")}{:lang("custom.name")}</option>
                                {foreach :getMyCustomList() as $val}
                                <option value="{$val.id}" {if $val.id==$row.custom_id}selected{/if}
                                >{$val.number} {$val.name} {$val.accounting_name}
                                </option>
                                {/foreach}
                            </select>
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">{:lang('collect.invoice_type')}</label>
                        <div class="layui-input-inline">
                            <select name="invoice_type" lay-verify="required"
                                    default-value="{$row.invoice_type|default=''}"
                                    data-select-type="invoice_type_list">
                            </select>
                        </div>
                        <label class="layui-form-label">{:lang('collect.serve_type')}</label>
                        <div class="layui-input-inline">
                            <select name="serve_type" lay-verify="required" default-value="{$row.serve_type|default=''}"
                                    data-select-type="serve_type_list">
                            </select>
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">{:lang('collect.article')}</label>
                        <div class="layui-input-block">
                            <input name="article" class="layui-input" value="{$row.article|default=''}"
                                   placeholder="{:lang('common.input')}{:lang('collect.article')}">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">{:lang('collect.money')}</label>
                        <div class="layui-input-inline">
                            <input type="text" name="money" class="layui-input" lay-verify="required"
                                   placeholder="{:lang('common.input')}{:lang('collect.money')}"
                                   value="{$row.money|default=''}" onkeyup="javascript:onlyNumber(this)">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">{:lang('collect.remark')}</label>
                        <div class="layui-input-block">
                            <input name="remark" class="layui-input" value="{$row.remark|default=''}"
                                   placeholder="{:lang('common.input')}{:lang('collect.remark')}">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">{:lang('collect.invoice_status')}</label>
                        <div class="layui-input-inline">
                            <select name="invoice_status" lay-verify="required"
                                    default-value="{$row.invoice_status|default=''}"
                                    data-select-type="collect_invoice_status_list">
                            </select>
                        </div>
                        <label class="layui-form-label">{:lang('collect.invoice_date')}</label>
                        <div class="layui-input-inline">
                            <input name="invoice_date" class="layui-input cssDate"
                                   placeholder="{:lang('common.choose')}{:lang('collect.invoice_date')}"
                                   value="{$row.invoice_date|default=''}">
                            </select>
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">{:lang('collect.path')}</label>
                        <div class="layui-input-block">
                            <input type="hidden" name="path_id" id="path_id" value="{$row.path_id|default=''}">
                            <span><a id="upload_path" class="layui-btn">
                    <i class="fa fa-upload"></i> {:lang('common.btn_upload')}</a></span>
                            <div id="path_item">
                                {if !empty($row.path_id)}
                                <a target="_blank" href="{$row.path_url}">{$row.path_name}</a>
                                <i class="fa fa-close" onclick="removePath(this)"></i>
                                {/if}
                            </div>
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label required">{:lang('collect.status')}</label>
                        <div class="layui-input-inline">
                            <select name="status" lay-verify="required" default-value="{$row.status|default=''}"
                                    data-select-type="collect_status_list">
                            </select>
                        </div>
                        <label class="layui-form-label">{:lang('collect.collect_date')}</label>
                        <div class="layui-input-inline">
                            <input name="collect_date" class="layui-input cssDate"
                                   placeholder="{:lang('common.choose')}{:lang('collect.collect_date')}"
                                   value="{$row.collect_date|default=''}">
                            </select>
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">{:lang('collect.first_date')}</label>
                        <div class="layui-input-inline">
                            <input name="first_date" class="layui-input cssDate"
                                   placeholder="{:lang('common.choose')}{:lang('collect.first_date')}"
                                   value="{$row.first_date|default=''}">
                            </select>
                        </div>
                        <label class="layui-form-label">{:lang('collect.second_date')}</label>
                        <div class="layui-input-inline">
                            <input name="second_date" class="layui-input cssDate"
                                   placeholder="{:lang('common.choose')}{:lang('collect.second_date')}"
                                   value="{$row.second_date|default=''}">
                            </select>
                        </div>
                    </div>
                </div>
                <div class="layui-tab-item">
                    {if !empty($row['id']) && auth('tally.Ratio/index') }
                    <table class="layui-table">
                        <thead>
                        <tr>
                            <th style="width:30px">{:lang('common.numbers')}</th>
                            <th>{:lang('ratio.assigner')}</th>
                            <th>{:lang('ratio.ratio')}</th>
                            {if auth('tally.Ratio/edit') || auth('tally.Ratio/delete') }
                            <th style="width:85px">{:lang('common.operate')}</th>
                            {/if}
                        </tr>
                        </thead>
                        <tbody>
                        {foreach $ratioList as $i=>$vo }
                        <tr>
                            <td>{$i+1}</td>
                            <td>{$vo.assigner_name}</td>
                            <td>{$vo.ratio}</td>
                            {if auth('tally.Ratio/edit') || auth('tally.Ratio/delete') }
                            <td>
                                {if auth('tally.Ratio/edit') }
                                <a href="#" class="layui-btn layui-btn-success layui-btn-xs"
                                   onclick="return editRatio('{$vo.id}')">{:lang('common.btn_edit')}</a>
                                {/if}
                                {if auth('tally.Ratio/delete') }
                                <a href="#" class="layui-btn layui-btn-danger layui-btn-xs"
                                   onclick="return deleteRatio('{$vo.id}')">{:lang('common.btn_delete')}</a>
                                {/if}
                            </td>
                            {/if}
                        </tr>
                        {/foreach}
                        </tbody>
                    </table>
                    {/if}
                </div>
            </div>
        </div>
    </form>
</div>
<script>
    layui.use(['myApp'], function () {
        var $ = layui.jquery
            , upload = layui.upload
            , myCommon = layui.myCommon
            , element = layui.element;

        window.removePath = function (dom) {
            $(dom).closest('#path_item').html('');
            $('#path_id').val(0);
        }

        upload.render({
            elem: '#upload_path'
            , url: myCommon.url('ajax/upload')
            , accept: 'file'
            , exts: 'jpg|png|gif|bmp|jpeg|pdf|xls|xlsx|doc|docx'
            , done: function (res) {
                if (res.code == 0) {
                    $('#path_item').html('<a target="_blank" href="' + res.data.url + '">' + res.data.name + '</a>'
                        + '<i class="fa fa-close" onclick="removePath(this)"></i>');
                    $('#path_id').val(res.data.id);
                }
            }
        })

        $('#addRatio').click(function () {
            return popupWindow("{:lang('ratio.btn_add')}", 'tally.ratio/add?collect_id={$row.id|default=""}'
                , function (ret) {
                    refreshRatio();
                }, 600, 400);
        });
        window.refreshRatio = function (id) {
            location = myCommon.url('tally.collect/edit?id={$row.id|default=""}&t=' + (new Date()).getTime()
                + '#card=ratio');
        }
        window.editRatio = function (id) {
            return popupWindow("{:lang('common.btn_edit')}{:lang('ratio.name')}", 'tally.ratio/edit?id=' + id
                , function (ret) {
                    refreshRatio();
                }, 600, 400);
        }
        window.deleteRatio = function (id) {
            myCommon.msg.confirm("{:lang('ratio.confirm_delete_info')}", function () {
                myCommon.request.post({
                    url: 'tally.ratio/delete'
                    , data: {
                        id: id
                    }
                    , prefix: true
                }, function (res) {
                    if (res.code == 0) {
                        refreshRatio();
                    }
                });
            })
            return false;
        }

        element.on('tab(card)', function () {
            if (this.getAttribute('lay-id') == 'ratio') {
                $('#addRatio').removeClass('hide');
            } else {
                $('#addRatio').addClass('hide');
            }
        });

        // 监听tab切换
        let layid = location.hash.replace(/^#card=/, '');
        if (layid != '') {
            element.tabChange('card', layid);
        }

        myCommon.listen();
    });
</script>
